<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title>Title</title>
		<link rel="stylesheet" href="../../lib/layui/css/layui.css" media="all">
	</head>

	<body>
		<form class="layui-form" action="">
			<div class="layui-form-item">
				<label class="layui-form-label">采购计划单</label>
				<div class="layui-input-inline">
					<input type="text" name="purchasingplanId" id="purchasingplanId" placeholder="请输入标题" autocomplete="off" class="layui-input">
				</div>
				<label class="layui-form-label">计划人</label>
				<div class="layui-input-inline">
					<input type="text" name="planerId" id="planerId" placeholder="请输入标题" autocomplete="off" class="layui-input">
				</div>
				<label class="layui-form-label">审核者</label>
				<div class="layui-input-inline">
					<input type="text" name="uname" id="uname" placeholder="请输入标题" autocomplete="off" class="layui-input">
				</div>
				<div class="layui-input-inline">
					<button class="layui-btn" lay-submit lay-filter="formDemo">检索</button>
				</div>
			</div>
		</form>
		<table id="demo" lay-filter="test"></table>
		<script type="textml" id="barDemo">
			{{# if(d.inspector_status === 0){ }}
			<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">提交审核</a>
			{{# } else if(d.inspector_status === 1){ }}
			<a class="layui-btn layui-btn-xs" lay-event="csk">入库</a>
			{{# } else { }}
			<!--   {{d.title}}(普通用户)-->
			{{# } }}

		</script>
		<script type="text/html" id="titleTpl">
			{{# if(d.inspector_status === 1){ }}
			<span style="color: #00FF00;">通过</span> {{# } else if(d.inspector_status === 2){ }}
			<span style="color: #FF0000;">不通过</span> {{# } else if( d.inspector_status === 0){ }}
			<!--   {{d.title}}(普通用户)-->
			<span style="color: #7B4397;">待审核</span> {{# } }}
		</script>
		<script src="../../layui/layui.js"></script>
		<script src="../../js/User.js" type="text/javascript" charset="utf-8"></script>
		<script>
			layui.use(['table', 'form'], function() {
				var table = layui.table;
				var $ = layui.$;
				var form = layui.form;
				//第一个实例
				table.render({
					elem: '#demo',
					height: 312,
					url: globalData.server + 'Pur/getAllPur' //数据接口
						,
					page: true //开启分页
						,
					cols: [
						[ //表头
							{
								field: 'purchasingplan_id',
								title: '采购计划ID',
								width: 155,
								sort: true,
								fixed: 'left'
							}, {
								field: 'purchasing_department',
								title: '采购部门',
								width: 100
							}, {
								field: 'supplier_id',
								title: '供应商',
								width: 100
							}, {
								field: 'purchasingplan_date',
								title: '计划日期',
								width: 250,
								templet: "<div>{{!d.purchasingplan_date?'':layui.util.toDateString(d.purchasingplan_date,'yyyy-MM-dd HH:mm:ss')}}</div>"
							}, {
								field: 'planer_id',
								title: '计划人',
								width: 100
							}, {
								field: 'reamrks',
								title: '备注',
								width: 100
							}, {
								field: 'create_date',
								title: '录入日期',
								width: 100,
								templet: "<div>{{!d.create_date?'':layui.util.toDateString(d.create_date,'yyyy-MM-dd HH:mm:ss')}}</div>"
							}, {
								field: 'uname',
								title: '审核者',
								width: 100
							}, {
								field: 'inspector_status',
								title: '审核状态',
								width: 100,
								templet: '#titleTpl'
							}, {
								field: 'if_handle',
								title: '是否处理',
								width: 100
							}, {
								title: '操作',
								width: 300,
								toolbar: '#barDemo'
							}

							/* //里的toolbar值是模板元素的选择器 */

						]
					]
				});
				$.getJSON("/Pur/getAllPur", function(obj) {
					if(obj.count > 0) {
						for(var i = 0; i < obj.data.length; i++) {
							$("#purchasingplanId").append(
								new Option(obj.data[i].handleId,
									obj.data[i].alarmDate))
						}
						form.render('select');
					}

				})
				//监听搜索
				form.on('submit(formDemo)', function(data) {
					//上述方法等价于
					table.reload('demo', {
						where: { //设定异步数据接口的额外参数，任意设
							purchasingplanId: data.field.purchasingplanId,
							planerId: data.field.planerId,
							uname: data.field.uname
						}
					}); //只重载数据
					return false;
				});
				/**/
				table.on('tool(test)', function(obj) {
				if (obj.event === 'del') {
				
				} else if (obj.event === 'edit') {
					console.log(obj.data);
					layer.open({
						type : 2,
						area : [ '500px', '400px' ],
						content : 'purchasingplanShenHe.html',
						title : '编辑',
						success : function(layero, index) {
							var body = layer.getChildFrame('body', index);
							body.contents().find("#purchasingplan_id").val(obj.data.purchasingplan_id);
							body.contents().find("#purchasing_department").val(obj.data.purchasing_department);							
							body.contents().find("#purchasingplan_date").val(obj.data.purchasingplan_date);
							body.contents().find("#planer_id").val(obj.data.planer_id);
							body.contents().find("#reamrks").val(obj.data.reamrks);
							body.contents().find("#create_date").val(obj.data.create_date);
							body.contents().find("#uname").val(obj.data.uname);
							body.contents().find("#inspector_status").val(obj.data.inspector_status);
							body.contents().find("#if_handle").val(obj.data.if_handle);
						},
						end : function() { 
							window.location.reload();
						}
					});
				}else if (obj.event === 'csk') {
            		var index = layer.open({
					title : '给'+globalData.getUserName()+'设置角色',
					type : 2,
					shade : 0.2,
					maxmin : true,
					shadeClose : true,
					area : ['500px', '400px' ],
					content : 'purchasingplanShenHe.html',
					success : function(layero, index) {
						var body = layer.getChildFrame('body', index);
							body.contents().find("#purchasingplan_id").val(obj.data.purchasingplan_id);
							body.contents().find("#supplier_id").val(obj.data.supplier_id);
							body.contents().find("#purchasing_department").val(obj.data.purchasing_department);							
							body.contents().find("#purchasingplan_date").val(obj.data.purchasingplan_date);
							body.contents().find("#planer_id").val(obj.data.planer_id);
							body.contents().find("#reamrks").val(obj.data.reamrks);
							body.contents().find("#create_date").val(obj.data.create_date);
							body.contents().find("#uname").val(obj.data.uname);
							body.contents().find("#inspector_status").val(obj.data.inspector_status);
							body.contents().find("#if_handle").val(obj.data.if_handle);
					},
					end : function() {
						window.location.reload();
					}
				});
                $(window).on("resize", function () {
                    layer.full(index);
                });
            }
			});
			});
		</script>
	</body>

</html>